<#assign pageTitle="${teacher.name!}_${siteCompany.siteName!}"/>
<#assign pageKeywords = pageTitle />
<#assign pageDescription = pageTitle />
<#assign pageHeader>
    <link rel="stylesheet" type="text/css" href="/static/h5/css/course.css" />
    <link rel="stylesheet" type="text/css" href="/static/h5/css/teacher.css" />
</#assign>
<#assign pageContent>
    <van-nav-bar
            title="${teacher.name!}"
            left-text="返回"
            right-text="首页"
            left-arrow
            @click-left="window.history.back();"
            @click-right="window.location.href='/';"
            fixed
            placeholder
    ></van-nav-bar>
    <div class="teacher-view-header">
        <div class="teacher-info-top">
            <div class="teacher-img">
                <img src="${teacher.avatar!}" alt="${teacher.name!}">
            </div>
            <div class="teacher-name">
                <h3>
                    ${teacher.name!}
                    <#if teacher.starId == 1>
                        （助教）
                    <#elseif teacher.starId == 2>
                        （讲师）
                    <#elseif teacher.starId == 3>
                        （高级讲师）
                    <#elseif teacher.starId == 4>
                        （副教授）
                    <#elseif teacher.starId == 5>
                        （教授）
                    </#if>
                </h3>
                <p>${teacher.tags!}</p>
                <div class="list-teacher-type">
                    <#if teacher.tags?? && teacher.tags != ''>
                        <#list teacher.tags?split(',') as item>
                            <span>${item}</span>
                        </#list>
                    </#if>
                </div>
            </div>
        </div>
        <div class="list-teacher-introduce">
            ${teacher.intro!}
        </div>
    </div>
    <div class="teacher-view-body mt-12">
        <van-tabs @click="clickType()" v-model="active" animated  sticky>
            <van-tab title="同步课 (${courseCount})">
                <van-pull-refresh v-model="dtRefreshing" @refresh="onRefreshDt" class="main-item">
                    <van-list
                            v-model="dtLoading"
                            :finished="dtFinished"
                            :error.sync="error"
                            finished-text="没有更多了"
                            error-text="请求失败，点击重新加载"
                            @load="onLoadDt"
                            class="course-card"
                    >
                        <van-row gutter="12">
                            <van-col span="12"  v-for="(item,index) in dtList" :key="index" >
                                <a :href="'/course/view/'+ item.courseId +'.html'">
                                    <div class="course-pic"><img v-lazy="item.cover"  alt=""></div>
                                    <div class="course-info">
                                        <div class="course-name text-two">{{item.courseName}}</div>
                                    </div>
                                    <div class="course-price">
                                        <div class="fl">{{item.categoryName}}</div>
                                        <div class="fr">¥{{item.price/100.0}}</div>
                                    </div>
                                </a>
                            </van-col>
                        </van-row>
                    </van-list>
                </van-pull-refresh>
            </van-tab>
            <van-tab title="大师课 (${proCount})">
                <van-pull-refresh v-model="dtRefreshing" @refresh="onRefreshDt" class="main-item">
                    <van-list
                            v-model="dtLoading"
                            :finished="dtFinished"
                            :error.sync="error"
                            finished-text="没有更多了"
                            error-text="请求失败，点击重新加载"
                            @load="onLoadDt"
                            class="course-card"
                    >
                        <van-row gutter="12">
                            <van-col span="12" v-for="(item,index) in dtList" :key="index" >
                                <a :href="'/course/view/'+ item.courseId +'.html'">
                                    <div class="course-pic"><img v-lazy="item.cover"  alt=""></div>
                                    <div class="course-info">
                                        <div class="course-name text-two">{{item.courseName}}</div>
                                    </div>
                                    <div class="course-price">
                                        <div class="fl">{{item.categoryName}}</div>
                                        <div class="fr">¥{{item.price/100.0}}</div>
                                    </div>
                                </a>
                            </van-col>
                        </van-row>
                    </van-list>
                </van-pull-refresh>
            </van-tab>
        </van-tabs>
    </div>
</#assign>
<#assign pageScript>
    <script>
        var courseType = "course";
        var teacherId = ${teacher.id};
        new Vue({
            el: '#app',
            data() {
                return {
                    showFooter: true,
                    activeTab:2,
                    courseType :courseType,
                    teacherId :teacherId,
                    dtList: [],//加载所有内容
                    dtLoading: false,
                    dtFinished: false,
                    dtRefreshing: false,
                    dtPage: 0,
                    error: false,
                    limit: 5,
                    showList: false,
                    emptyDoc: false,
                    checked:false,
                    active:0
                }
            },
            methods: {
                onLoadDt() {
                    var _self = this;
                    if (_self.dtRefreshing) {
                        _self.dtList = [];
                        _self.dtRefreshing = false;
                    }
                    _self.dtPage = _self.dtPage + 1;
                    _self.dtLoading = true;
                    var data = new FormData();
                        data.append("page", _self.page)
                        data.append("limit", _self.limit)
                        data.append("type", _self.courseType)
                        data.append("teacherId", _self.teacherId)
                    axios.post('/teacher/get/list.json', data).then(function (response) {
                        if (response.data.code === 0) {
                            _self.dtList = _self.dtList.concat(response.data.data.data);
                            if (response.data.data.data.length < _self.limit) {
                                _self.dtFinished = true;
                            }
                            if (response.data.data.data.length == 0 && _self.dtPage < 2) {//初始未请求到数据
                                _self.emptyDoc = true;
                                return
                            }
                        } else {
                            _self.error = true;
                        }
                        _self.dtLoading = false;
                    }).catch(function (error) {
                        _self.error = true;
                        _self.dtLoading = false;
                    });
                },
                clickType(){
                    var _self = this;
                    if(_self.active < 1){
                        _self.courseType = "course"
                    }else {
                        _self.courseType = "pro"
                    }
                    _self.onRefreshDt();
                },
                onRefreshDt() {
                    // 重新加载数据
                    let _self = this;
                    _self.dtRefreshing = true;
                    _self.dtPage = 0;
                    _self.dtList = [];
                    _self.onLoadDt();
                },
            },
        })
    </script>
</#assign>
<#include "../layout_h5.ftl" />